﻿@using System.ComponentModel
@using System.Text.RegularExpressions

<Tab>
    <TabItem Text="基础配置">
        @if (@BigScreen.SelectedByDesigner != null)
        {
            <Collapse IsAccordion="true">
                <CollapseItems>
                    <CollapseItem Text="通用属性">
                        <Tooltip Delay="1000" Title="@BigScreen.SelectedByDesigner.GetPropertyDescription("Id")">
                            <div class="over-input">
                                <BootstrapInput @bind-Value="@(BigScreen.SelectedByDesigner.Id)" ShowLabel="true" Readonly="true"></BootstrapInput>
                            </div>
                        </Tooltip>
                        <Tooltip Delay="1000" Title="@BigScreen.SelectedByDesigner.GetPropertyDescription("Top")">
                            <div class="over-input">
                                <BootstrapInputNumber @bind-Value="@BigScreen.SelectedByDesigner.Top" Max="200" Min="-100" ShowLabel="true" ShowButton="true" OnValueChanged="OnValueChanged" />
                            </div>
                        </Tooltip>
                        <Tooltip Delay="1000" Title="@BigScreen.SelectedByDesigner.GetPropertyDescription("Left")">
                            <div class="over-input">
                                <BootstrapInputNumber @bind-Value="@BigScreen.SelectedByDesigner.Left" Max="200" Min="-100" ShowLabel="true" ShowButton="true" OnValueChanged="OnValueChanged" />
                            </div>
                        </Tooltip>
                        <Tooltip Delay="1000" Title="@BigScreen.SelectedByDesigner.GetPropertyDescription("Width")">
                            <div class="over-input">
                                <BootstrapInputNumber @bind-Value="@BigScreen.SelectedByDesigner.Width" Max="200" Min="-100" ShowLabel="true" ShowButton="true" OnValueChanged="OnValueChanged" />
                            </div>
                        </Tooltip>
                        <Tooltip Delay="1000" Title="@BigScreen.SelectedByDesigner.GetPropertyDescription("Height")">
                            <div class="over-input">
                                <BootstrapInputNumber @bind-Value="@BigScreen.SelectedByDesigner.Height" Max="200" Min="-100" ShowLabel="true" ShowButton="true" OnValueChanged="OnValueChanged" />
                            </div>
                        </Tooltip>
                        <Tooltip Delay="1000" Title="@BigScreen.SelectedByDesigner.GetPropertyDescription("Angle")">
                            <div class="over-input">
                                <BootstrapInputNumber @bind-Value="@BigScreen.SelectedByDesigner.Angle" Max="200" Min="-100" ShowLabel="true" ShowButton="true" OnValueChanged="OnValueChanged" />
                            </div>
                        </Tooltip>
                        @* <ColorPicker @bind-Value="@BigScreen.SelectedList[0].Option.backgroundColor" OnValueChanged="OnValueChangedForString"></ColorPicker> *@
                        @* <BootstrapInput @bind-Value="@BigScreen.SelectedList[0].Option.grid[0].left" OnValueChanged="OnValueChangedForString"></BootstrapInput> *@
                    </CollapseItem>
                    <CollapseItem Text="X轴设置">
                        <SharedPage.Components.Cfg.XAxisList @bind-Value="@BigScreen.SelectedByDesigner.Option"></SharedPage.Components.Cfg.XAxisList>

                        @if (@BigScreen.SelectedByDesigner.Option!.xAxis != null && false)
                        {

                            @foreach (var item in @BigScreen.SelectedByDesigner.Option!.xAxis)
                            {
                                @* <CollapseItem @key="item" @bind-Text="item.name"> *@
                                <Button OnClick="()=>{DeleteXaxis(item);}" Size="Size.Small">删除这个轴</Button>
                                <BootstrapInput @bind-Value="@item.name"></BootstrapInput>
                                @* OnValueChanged="async(e)=>{await ChanedForanimationDelay(item,e);}" *@
                                <Tooltip Delay="1000" Title="@item.GetPropertyDescription("animationEasing")">
                                    <div class="over-input">
                                        <Select @bind-Value="@item.animationEasing" PlaceHolder="默认值" ShowLabel="true"></Select>
                                    </div>
                                </Tooltip>
                                <JsInput @bind-JsFuncNumString="item.animationDelay" DisplayText="动画延迟"></JsInput>
                                <SharedPage.Components.Cfg.AxisLineCfg @bind-Value="item.axisLine"></SharedPage.Components.Cfg.AxisLineCfg>
                                @* </CollapseItem> *@
                            }
                        }


                    </CollapseItem>
                    <CollapseItem Text="Y轴设置">
                        <SharedPage.Components.Cfg.YAxisList @bind-Value="@BigScreen.SelectedByDesigner.Option"></SharedPage.Components.Cfg.YAxisList>
                    </CollapseItem>
                    <CollapseItem Text="数据源设置">
                        <Button OnClick="DataSourceSetting2">获取数据源</Button>
                    </CollapseItem>
                    <CollapseItem Text="序列设置">
                        <Button>根据数据自动匹配</Button>
                    </CollapseItem>
                </CollapseItems>
            </Collapse>
        }

        else
        {
            <div>选定一个组件</div>
        }

    </TabItem>
    <TabItem Text="页面配置">
        @if (BigScreen != null)
        {
            <BootstrapInput @bind-Value="BigScreen.DisplayName" ShowLabel="true"></BootstrapInput>
            <BootstrapInput @bind-Value="BigScreen.GroupName" ShowLabel="true"></BootstrapInput>
            <Tooltip Delay="1000" Title="@BigScreen.GetPropertyDescription("OrderNum")">
                <BootstrapInput @bind-Value="BigScreen.OrderNum" ShowLabel="true" OnValueChanged="async(e)=>{await Refresh();}"></BootstrapInput>
            </Tooltip>

            <Tooltip Delay="1000" Title="@BigScreen.Css.GetPropertyDescription("width")">
                <div class="over-input">
                    <BootstrapInput @bind-Value="BigScreen.Css.width" ShowLabel="true" OnValueChanged="async(e)=>{await Refresh();}" />
                </div>
            </Tooltip>
            <div class="over-input">
                <BootstrapInput @bind-Value="BigScreen.Css.height" ShowLabel="true" OnValueChanged="async(e)=>{await Refresh();}" />
                <Tooltip Title="@BigScreen.Css.GetPropertyDescription("height")" CustomClass="is-invalid">
                    <i class="fas fa-circle-question" />
                </Tooltip>
            </div>
            @*          <Tooltip Delay="1000" Title="@GetPropertyDescription(BigScreen.Css,"top")">
        <div class="over-input">
        <BootstrapInput @bind-Value="BigScreen.Css.top" ShowLabel="true" OnValueChanged="async(e)=>{await Refresh();}" />
        </div>
        </Tooltip>
        <Tooltip Delay="1000" Title="@GetPropertyDescription(BigScreen.Css,"left")">
        <div class="over-input">
        <BootstrapInput @bind-Value="BigScreen.Css.left" ShowLabel="true" OnValueChanged="async(e)=>{await Refresh();}" />
        </div>
        </Tooltip> *@
            <Tooltip Delay="1000" Title="@BigScreen.Css.GetPropertyDescription("background_color")">
                <ColorPicker @bind-Value="BigScreen.Css.background_color" ShowLabel="true" OnValueChanged="async(e)=>{await Refresh();}" />
            </Tooltip>

            @*         <Collapse>
        <CollapseItems>
        <CollapseItem>

        </CollapseItem>
        </CollapseItems>
        </Collapse> *@
        }

    </TabItem>
</Tab>


@code {
    [Inject]
    [NotNull]
    private DialogService? DialogService { get; set; }
    [Inject]
    [NotNull]
    private MessageService? Msg { get; set; }
    [Inject]
    [NotNull]
    public JsInterOp? JsEcharts { get; set; }
    [Parameter]
    [NotNull]
    public BigScreen? BigScreen { get; set; }

    [CascadingParameter]
    [NotNull]
    public List<BigScreen>? BigScreens { get; set; }

    public string? BigScreenName { get; set; }
    private async Task Refresh()
    {
        BigScreen?.RefreshHandel?.Invoke(true);
        await Task.CompletedTask;
    }
    public async Task OnValueChanged(double val)
    {

        await Refresh();
        await Task.CompletedTask;
    }
    public async Task OnValueChangedForString(string val)
    {
        BigScreen?.RefreshHandel?.Invoke(true);
        await Task.CompletedTask;
        TreeItem a = new();

    }
    public void DeleteXaxis(ExAxis axis)
    {
        BigScreen.SelectedByDesigner!.Option!.xAxis!.Remove(axis);
        BigScreen?.RefreshHandel?.Invoke(true);

    }
    public async void AddXaxis()
    {
        if (BigScreen.SelectedList[0].Option!.xAxis == null)
        {
            BigScreen.SelectedList[0].Option!.xAxis = new List<ExAxis>();
        }
        BigScreen.SelectedList[0].Option!.xAxis!.Add(new ExAxis() { name = new JsVal("X轴" + (BigScreen.SelectedList[0].Option!.xAxis!.Count + 1), JsType.String) });
        BigScreen?.RefreshHandel?.Invoke(true);
        await Task.CompletedTask;
    }


    Task OnvalueChanged(object o)
    {
        return Task.CompletedTask;
    }
    private async Task ChanedForanimationDelay(ExAxis axis, object? o)
    {
        // var res = ToFanuc(o);
        // if (res != null)
        // {

        //     await Msg.Show(new MessageOption() { Content = "设置成功", Color = Color.Success });
        // }
        // else
        // {
        //     await Msg.Show(new MessageOption() { Content = "非法值,请输入数字或者有效的JS函数体", Color = Color.Danger });
        // }
        // axis.animationDelay = res;
        // await JsEcharts.Log(BigScreen);
    }
    private object? ToFanuc(object? o)
    {
        var st = o?.ToString();
        if (!string.IsNullOrEmpty(st))
        {
            if (int.TryParse(o?.ToString(), out int aa))
            {
                return aa;
            }
            else
            {
                if (IsJavaScriptFunction(st))
                {
                    return new JsFunc(st);
                }
                else
                {
                    return null;
                }
            }
        }
        return null;
    }
    static bool IsJavaScriptFunction(string input)
    {
        // 使用正则表达式匹配 JavaScript 函数的特征
        string pattern = @"(?i)^\s*function\s*\([^)]*\)\s*{\s*.*\s*}\s*$";
        return Regex.IsMatch(input, pattern);
    }
    async void DataSourceSetting2()
    {
        await DialogService.ShowModal<DataSourceSetting>(new ResultDialogOption()
            {
                ComponentParameters = new Dictionary<string, object>
                {
                    [nameof(DataSourceSetting.EOption)] = BigScreen.SelectedByDesigner.Option
                },
                IsDraggable = true,
                Title = ""
            });
        BigScreen?.RefreshHandel?.Invoke(true);//必须手动调用刷新
    }
}
@* 属性面板 *@